<template>
	<view class="nas-family">
		<view class="nas-fileContent">
			<view class="nas-top-bar">
				<view class="nas-bar-item" @click="goBack"><image src="../../../static/nas-static/nas_back_s.svg" mode=""></image></view>
				<view class="nas-bar-item">{{ title }}</view>
				<view class="nas-bar-item" @click="goHome">取消</view>
			</view>
			<view v-show="showContent">
				<view class="nas-family-title">选择家庭</view>
				<view class="nas-family-item" v-for="(item, index) in fileList" :key="index" @click="intoFile(item)">
					<view class="nas-family-one">
						<image :src="item.groupHeadUrl" mode=""></image>
						<view class="nas-family-one-item">{{ item.groupName }}</view>
					</view>
					<view class="nas-family-two">
						<image src="../../../static/nas-static/nas-right-icon.svg" mode=""></image>
					</view>
				</view>
			</view>

			<!-- 底部操作栏 -->
			<!-- <view class="nas-bottom">
				<view class="nas-cancel" @click="goHome">取消</view>
				<view class="nas-confirm" @click="goLocation">确定</view>
			</view> -->
		</view>
	</view>
</template>

<script>
import request from '../utils/request.js';
export default {
	data() {
		return {
			fileList: [],
			showContent: true,
			title: '分享至',
			showCreateFile: false,
			createFileName: '',
			directorys: [], // 原本的文件地址数组
			newDirectory: '', // 新的文件地址
			familyInfos: '' // 传递的选项信息
		};
	},
	onLoad(e) {
		this.familyInfos = e.infos
		this.getInfos();
	},
	methods: {
		async getInfos() {
			this.showBottomMore = false;
			const params = {
				method: 'POST',
				url: '/naslocal/liantong/familyList',
				data: {
					type: '0'
				}
			};
			console.log(params, 'params')
			const res = await request(params);
			console.log(res, '家庭列表');
			// 过滤出文件夹
			this.fileList = res.data;
		},
		intoFile(item) {
			uni.navigateTo({
				url: `/pages/nas/nas-saveUploadFile/nas-saveUploadFile?type=5&id=${item.id}&familyInfos=${this.familyInfos}`
			});
		},
		goBack() {
			uni.navigateBack({
				delta: 1
			});
		},
		goHome() {
			uni.navigateBack({
				delta: 1
			});
		},
		// 确认移动文件
		async goLocation() {
			for (let i = 0; i < this.directorys.length; i++) {
				const direcList = this.directorys[i].split('/');
				const params = {
					method: 'POST',
					url: '/nas/rd_center/data/get',
					data: {
						method: 'capacity.nas.cloud.file.dir.rename',
						type: 1,
						data: {
							directory: this.directorys[i],
							newDirectory: this.newDirectory + '/' + direcList[direcList.length - 1]
						}
					}
				};
				// console.log(params, '移动文件的请求头');
				const res = await request(params);
				// console.log(res, '移动文件的返回数据');
				// 返回首页
				uni.$emit('refreshData');
				uni.navigateBack({
					delta: 1
				});
			}
		},
	}
};
</script>

<style lang="scss" scoped>
.nas-family {
	position: relative;
	height: 100vh;
	overflow-y: hidden;
	background: #fff;
	.nas-fileContent {
		position: absolute;
		top: 158rpx;
		left: 0;
		right: 0;
		bottom: 0;
		overflow-y: auto;
	}
	.nas-family-title {
		height: 96rpx;
		background: #f5f5f5;
		display: flex;
		align-items: center;
		padding-left: 32rpx;
		font-family: HarmonyOS_Sans_SC;
		font-size: 28rpx;
		color: #808080;
		letter-spacing: 0;
		font-weight: 400;
	}
	.nas-family-item {
		display: flex;
		align-items: center;
		height: 96rpx;
		justify-content: space-between;
		border-bottom: 1rpx solid #f5f5f5;
		margin: 0rpx 32rpx;
		.nas-family-one {
			display: flex;
			align-items: center;
			image {
				width: 56rpx;
				height: 56rpx;
				border-radius: 50%;
			}
			.nas-family-one-item {
				margin-left: 16rpx;
				font-family: HarmonyOS_Sans_SC;
				font-size: 32rpx;
				color: #333333;
				letter-spacing: 0;
				font-weight: 400;
			}
		}
		.nas-family-two {
			width: 24rpx;
			height: 24rpx;
			image {
				width: 24rpx;
				height: 24rpx;
			}
		}
	}
	.nas-bottom {
		position: fixed;
		bottom: 0;
		left: 0;
		right: 0;
		height: 148rpx;
		display: flex;
		align-items: center;
		justify-content: space-around;
		background: #ffffff;
		.nas-cancel {
			width: 335rpx;
			height: 96rpx;
			background: #f5f5f5;
			border-radius: 48rpx;
			display: flex;
			align-items: center;
			justify-content: center;
			font-family: HarmonyOS_Sans_SC;
			font-size: 32rpx;
			color: #808080;
			letter-spacing: 0;
			font-weight: 400;
		}
		.nas-confirm {
			width: 335rpx;
			height: 96rpx;
			background: #3069dc;
			border-radius: 48rpx;
			display: flex;
			align-items: center;
			justify-content: center;
			font-family: HarmonyOS_Sans_SC;
			font-size: 32rpx;
			color: #ffffff;
			letter-spacing: 0;
			font-weight: 400;
		}
	}
	.nas-top-bar {
		position: fixed;
		top: 64rpx;
		left: 10rpx;
		right: 10rpx;
		height: 95rpx;
		display: flex;
		align-items: center;
		background: #ffffff;
		border-bottom: 1rpx solid #d9d9d9;
		.nas-bar-item {
			flex: 1;
			&:first-of-type {
				display: flex;
				align-items: center;
				image {
					width: 50rpx;
					height: 34rpx;
				}
			}
			&:nth-of-type(2) {
				text-align: center;
				ont-family: HarmonyOS_Sans_SC_Medium;
				font-size: 34rpx;
				color: rgba(51, 51, 51, 0.9);
				font-weight: 500;
			}
			&:last-of-type {
				text-align: right;
				font-family: HarmonyOS_Sans_SC;
				font-size: 28rpx;
				color: #3069dc;
				font-weight: 400;
				margin-right: 10rpx;
			}
		}
	}
	.nas-content {
		padding: 32rpx;
		text-align: center;
		font-family: HarmonyOS_Sans_SC;
		font-size: 28rpx;
		color: #808080;
		letter-spacing: 0;
		font-weight: 400;
	}
}
</style>
